<template>
  <div class="bottom">
    <a  :href="`${base_url}/portal/list?chnlcode=bidresult`"
      target="_blank"
    >
      <img src="../assets/resultfabu.png" class="topicimg"
    /></a>
    <div style="padding: 2%">
      <ul id="resultdata"  >
        <li
         v-for="(item, index) in jieguolist" :key="index" 
          style="
            width: 31%;
            padding: 0.25rem;
            border-left: 0.1rem solid #182c56;
            margin-top: 1rem;
          "
        >
          <a
            :href="item.url"
            target="_blank"
            style="
              height: 100%;
              display: inline-block;
              display: flex;
              flex-direction: column;
              justify-content: space-between;
            "
          >
            <div :title="item.title" style="width: 100%">{{ item.title }}</div>
            <div :title="item.publishdate" style="width: 100%">
              {{ item.publishdate }}
              <img src="../assets/rightjiantou.png"  style="width:0.9rem;height:0.9rem;"/>
            </div>
          </a>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import APIS from "@/api/index";
// import { Message } from "element-ui";
export default {
  data() {
    return {
      jieguolist: [],
    };
  },
  mounted() {
    this.getResultReleaseList()
  },
  methods: {
     //结果发布列表
     getResultReleaseList() {
      this.jieguolist = []
      APIS.Homepage.getResultReleaseList()
        .then((res) => { 
          res.data.map((item) => { 
            this.jieguolist.push({
              ...item,
              url: `${this.base_url}/portal/detail?docid=${item.docid}&chnlcode=${item.chnlcode}&objtype=${item.objtype}`,
            });
          });
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
};
</script>

<style scoped>
/* @import "../assets/css/index.css"; */
.bottom{
  width: 95%; 
  position: relative; 
  margin: 0 auto;
    border: 0.05rem solid #182c56;
    background: #edf1f9;
    border-radius: 0.5rem;
    margin-top: 2rem;
}
#resultdata{
  overflow-y: scroll;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
#resultdata > li > a { 
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-decoration: none;
  color: #182c56; 
}
#resultdata > li :hover{ 
  color:rgba(28, 47, 87,.7);
}
.topicimg {
    width: 94%;
    position: absolute;
    top: -0.8rem;
    left: 3%;
  }
</style>
